<script lang="ts" setup>
import apply from '@/api/apply'

const query = ref({})
onLoad(async (options: any) => {
  query.value = options
  if (options.applyId && options.merType) {
    await getDetail(options.merType, options.applyId)
  }
})

const detail = ref<any>({})

const dealtImageList: any = {}
function dealImageList(imageList: any) {
  imageList.forEach((image: any) => {
    dealtImageList[`fileType${image.fileType}`] = image.imageId
  })
}

async function getDetail(type, id) {
  if (type === '3') {
    const { data } = await apply.getSmallMerchantInfo(id)
    if (data.status === 'success') {
      detail.value = data.data
    }
    dealImageList(data.data.imageList)
  }
  else {
    const { data } = await apply.getMerchantInfo(id)
    if (data.status === 'success') {
      detail.value = data.data
    }
    dealImageList(data.data.imageList)
  }
}
</script>

<template>
  <div class="detail">
    <template v-if="query.merType === '3'">
      <detail-small-cert-info
        :data="detail"
        :image-ids="[dealtImageList.fileType5, dealtImageList.fileType6]"
      />
      <detail-small-mer-info
        :data="detail"
      />
      <detail-small-acct-info
        :data="detail"
        :image-ids="[dealtImageList.fileType20]"
      />
    </template>
    <template v-else>
      <detail-license-info
        :data="detail.licenseInfo"
        :image-ids="[dealtImageList.fileType54]"
      />
      <detail-operator-info
        :data="detail.operatorInfo"
        :merType="detail.licenseInfo.merType"
        :image-ids="[dealtImageList.fileType51, dealtImageList.fileType52]"
      />
      <detail-contact-info
        v-if="detail.operatorInfo && detail.operatorInfo.isSpecContact === '0'"
        :data="detail.contactInfo"
        :image-ids="[dealtImageList.fileType5, dealtImageList.fileType6]"
      />
      <detail-settlement-info
        v-if="dealtImageList.fileType20"
        :data="detail.settlementInfo"
        :image-ids="[dealtImageList.fileType20]"
      />
      <detail-settlement-info
        v-else
        :data="detail.settlementInfo"
        :image-ids="[]"
      />
    </template>
  </div>
</template>

<route lang="json">
{
  "style": {
    "navigationBarTitleText": "商户详情",
    "backgroundColorContent": "#f8f8f8"
  }
}
</route>

<style lang="sass" scoped>
.detail
  .value
    // color: #000
  .actions
    text-align: center
    padding: 20px 0
    margin: 20px 0

:deep(.nut-cell__value)
  word-break: break-all

:deep(.custom-cell-value .nut-cell__value)
  flex: 1.5

</style>
